<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
      <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
      <title>10100.ck.ua Maps</title>
      <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
      <script type="text/javascript" src="10100ckua.js"></script>
      <script type="text/javascript">


      function isMarkerVisible() {
         return (marker.getVisible());
      }
      
      function fillUrls() {
         var markerlat = null;
         var markerlng = null;
         if (isMarkerVisible()) {
            markerlat = marker.getPosition().lat();
            markerlng = marker.getPosition().lng();
         }
         var maptype = (map.getMapTypeId() == 'roadmap' ? 'map' : 'sat');
         fillUrlsCommon(map.getCenter().lat(), map.getCenter().lng(), map.getZoom(), maptype, markerlat, markerlng);
      }

      function processMarker() {
         if (marker.getVisible()) {
            marker.setVisible(false);
         } else {
            marker.setPosition(map.getCenter());
            marker.setVisible(true);
         }
         fillUrls();
         markerButtons();
      }


      function initialize() {
      
         initMapCanvasSize();

         var lat = getParameter('lat');
         if (lat == null || isNaN(lat))
            lat = def_lat;
         var lng = getParameter('lng');
         if (lng == null || isNaN(lat))
            lng = def_lng;
         var z = parseInt(getParameter('z'));
         if (z == null || isNaN(z))
            z = def_zoom;

         var mapType = getParameter('t');
         if (mapType == null)
            mapType = google.maps.MapTypeId.ROADMAP;
         else 
            if (mapType == 'sat')
              mapType = google.maps.MapTypeId.HYBRID;
            else 
              mapType = google.maps.MapTypeId.ROADMAP;

         var mlat = getParameter('mlat');
         var mlng = getParameter('mlng');
         var markerCoordinates = null;
         if (mlat != null && !isNaN(mlat) && mlng != null && !isNaN(mlng)) {
            markerCoordinates = new google.maps.LatLng(mlat, mlng);
         }
         
         var mapCenter = new google.maps.LatLng(lat, lng);

         
         var myOptions = {
           zoom: z,
           center: mapCenter,
           mapTypeId: mapType,
           scaleControl: true,
           scaleControlOptions: {
               position: google.maps.ControlPosition.BOTTOM_LEFT
           },
           mapTypeControl: true,
           panControl: true,
           panControlOptions: {
              position: google.maps.ControlPosition.RIGHT_TOP,
           },
           zoomControl: true,
           zoomControlOptions: {
              position: google.maps.ControlPosition.LEFT_BOTTOM,
              style: google.maps.ZoomControlStyle.LARGE
           },
           rotateControl: true,
           rotateControlOptions: {
              position: google.maps.ControlPosition.TOP_CENTER,
           },
           streetViewControl: false,
         };
         
         map = new google.maps.Map(document.getElementById("map_canvas"),
             myOptions);


         google.maps.event.addDomListener(map, 'zoom_changed', fillUrls);
         google.maps.event.addDomListener(map, 'center_changed', fillUrls);
         google.maps.event.addDomListener(map, 'maptypeid_changed', fillUrls);


         // MARKER
         marker = new google.maps.Marker({
            map: map,
            draggable: true,
            animation: google.maps.Animation.DROP,
            position: markerCoordinates,
            visible: (markerCoordinates != null ? true : false)
          });
          google.maps.event.addListener(marker, 'position_changed', fillUrls);

          
          fillUrls();

          initMarkerButtons(marker.getVisible());
          initStyleButtons();

       }

      function resizeMapA() {
         resizeMapCanvas('500px', '300px');
         google.maps.event.trigger(map, 'resize');
         fillUrls();
      }

      function resizeMapB() {
         resizeMapCanvas('800px', '600px');
         google.maps.event.trigger(map, 'resize');
         fillUrls();
      }

      </script>
      <script type="text/javascript">
      
        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', 'UA-1390959-6']);
        _gaq.push(['_trackPageview']);
      
        (function() {
          var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
          ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
          var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
      
      </script>
   </head>
   <body onload="initialize()">
      <a href="" id="refresh" >Обновить</a>
      <div id="map_canvas" style="width: 500px; height: 300px"></div>

      <div id="div_url" style="width: 500px; height: 30px">
         <input id="textlink" value="" title="линк" size="60" type="text" maxlength="2048" spellcheck="false" /><br/>
      </div>
      <div id="map_links" style="width: 500px; height: 120px">
         <table border="0" cellpadding="10" cellspacing="0">
            <tr valign="top">
            <td><a href="google-maps.html" id="google-maps">
               <img border="0" src="images/google.jpg"><br/>
               google</a><br/></td>
            <td><a href="yandex-maps.html" id="yandex-maps" >
               <img border="0" src="images/yandex.jpg"><br/>
               yandex</a><br/></td>
            <td><a href="visicom-maps.html" id="visicom-maps" >
               <img border="0" src="images/visicom.jpg"><br/>
               visicom</a><br/></td>
            <td><a href="google-maps-mobile.html" id="google-maps-mobile">
               <img border="0" src="images/google.jpg"><br/>
               google<br/> mobile</a><br/></td>
            </tr>
         </table>
      </div>
      <form> 
         <input id="setmarker" type="button" value="Поставить маркер" name="button1" onClick="processMarker()">
         <input id="removemarker" type="button" value="Убрать маркер" name="button2" onClick="processMarker()">  
      </form>
      <br/>
      <form> 
         <input id="resize500" type="button" value="Размер 500" name="button1" onClick="resizeMapA()">
         <input id="resize800" type="button" value="Размер 800" name="button2" onClick="resizeMapB()">  
      </form>
      
   </body>

</html>
